<template>
    <!-- <i class="icon iconfont icon-yuyanfanyi" @click="handleSetLanguage">
          </i> -->
          <i @click="handleSetLanguage">
              <input type="image" alt="Submit" v-if="lang" src="https://cdn3.iconfinder.com/data/icons/142-mini-country-flags-16x16px/32/flag-china2x.png" width="32" height="24" class="d-block mx-auto langselect">
              <input type="image" alt="Submit" v-else src="https://cdn3.iconfinder.com/data/icons/142-mini-country-flags-16x16px/32/flag-usa2x.png" width="32" height="24" class="d-block mx-auto langselect">
          </i>
</template>

<script>
export default {
   data() {
     return{
       lang: true
     }
   },
  computed: {
    // language() {
    //   return this.$store.getters.language
    // }
  },
  methods: {
    handleSetLanguage() {
      this.$i18n.locale = this.$i18n.locale === 'en' ? 'zh' : 'en'
      this.$i18n.locale === 'en' ? this.lang = false : this.lang = true
      // this.$store.state.user.lang.push([this.$i18n.locale])
      this.$store.dispatch('setLanguage', this.$i18n.locale)
    }
  },
  created(){
        this.$i18n.locale = this.$i18n.locale === 'en' ? 'zh' : 'en'
      this.$i18n.locale === 'en' ? this.lang = false : this.lang = true
      // this.$store.state.user.lang.push([this.$i18n.locale])
      this.$store.dispatch('setLanguage', this.$i18n.locale)
  }
}
</script>

<style scoped>
.icon-yuyanfanyi {
  font-size: 36px;
  color: #969896;
  cursor: pointer;
  vertical-align: -5px!important;
}
</style>

